<template>
	<view>
		<template v-if="init">
			<edit-form @goBack="goBack" :meetId="meetId" :isShare="isShare" :partInfo="partInfo"
				v-if="partInfo.pk_id > 0" @subFinsh="subFinsh" :dataForm="dataForm">
			</edit-form>
			<add-form v-else :meetId="meetId" :price="price" @subFinsh="subFinsh" :restaurant="restaurant"></add-form>
		</template>

		<u-popup v-model="showPhone" width="80%" mode="center">
			<view>
				<view class="cell_box">
					<view class="cell_item">
						<view class="title">姓名</view>
						<input class="input_view" v-model="dataForm.name" placeholder="请输入姓名" />
					</view>
					<view class="cell_item">
						<view class="title">手机号</view>
						<input class="input_view" v-model="dataForm.phone" placeholder="请输入手机号" type="number" />
					</view>
				</view>
				<view class="popup_btn_box">
					<view class="btn btn_l" @click="goBack">取消</view>
					<view class="btn" @click="goSearch">立即签到</view>
				</view>
			</view>
		</u-popup>
		<sww-login></sww-login>
	</view>
</template>

<script>
	import {
		wxConfig
	} from '@/mixins/wxConfig';
	import addForm from './components/addForm.vue';
	import editForm from './components/editForm.vue';
	import {
		isBefore,
		isAfter
	} from '@/utils/moment/index.js';
	import {
		isMobile
	} from '@/utils/validate.js'
	export default {
		mixins: [wxConfig],
		components: {
			'add-form': addForm,
			'edit-form': editForm
		},
		data() {
			return {
				meetId: null,
				restaurant: false, // 活动是否提供餐饮
				price: 0,
				partInfo: {},
				init: false,
				showPhone: false,
				dataForm: {
					name: '',
					phone: ''
				},
				isShare: false,// 用于控制点击返回按钮时，跳转的页面
			};
		},
		onLoad(options) {
			if (options && options.id) {
				this.meetId = Number(options.id);
				this.getBaseInfo()
				if (options.qrCode) {
					this.isShare = true
				}
				if (options.userPhone) {
					this.$login('phoneInit', null, 'goBack').then(() => {
						this.phoneInit()
					})
				} else {
					this.$login('initPage', true, 'goBack').then(() => {
						this.initPage()
					})
				}
			}

			// #ifdef H5
			this.initWxConfig(['chooseWXPay'])
				.then(() => {})
				.catch(() => {});
			// #endif
		},
		methods: {
			getBaseInfo() {
				this.$resPost('GetMeetingInfo', {
					pk_id: this.meetId
				}).then(({
					data
				}) => {
					this.price = Number(data.price || 0)
					this.restaurant = data.restaurant == 1 ? true : false
				})
			},
			initPage() {
				this.$loading();
				let params = {
					pk_id: this.meetId
				}
				if (this.dataForm.name) {
					params.name = this.dataForm.name
					params.phone = this.dataForm.phone
				}
				this.$resPost('GetMeetingUsersSigninInfo', {
					...params
				}).then(({
					data
				}) => {
					if (data[0]) {
						let current_date = new Date();
						let signMsg = '';
						if (isBefore(current_date, data[0].start_signin)) {
							signMsg = '未到签到时间';
						} else if (isAfter(current_date, data[0].end_signin)) {
							signMsg = '签到时间已过';
						}
						this.partInfo = {
							...data[0],
							signMsg
						};
					}
					this.$hide();
					this.init = true;
				});
			},
			subFinsh() {
				this.initPage();
			},
			phoneInit() {
				this.showPhone = true
			},
			goBack() {
				if (this.isShare) {
					this.$linkTo(`/package/meet/index?id=${this.meetId}`, 'redirectTo')
				} else {
					this.uniBack()
				}
			},
			goSearch() {
				if (!this.dataForm.name || !this.dataForm.phone) {
					this.$toast('请输入相关信息')
					return
				} else if (!isMobile(this.dataForm.phone)) {
					this.$toast('请输入正确的手机号')
					return
				}
				this.$resPost('GetMeetingUsersSigninInfo', {
					pk_id: this.meetId,
					name: this.dataForm.name,
					phone: this.dataForm.phone
				}).then(({
					data
				}) => {
					if (data[0] && data[0].pk_id) {
						let current_date = new Date();
						let signMsg = '';
						if (isBefore(current_date, data[0].start_signin)) {
							signMsg = '未到签到时间';
						} else if (isAfter(current_date, data[0].end_signin)) {
							signMsg = '签到时间已过';
						}
						this.partInfo = {
							...data[0],
							signMsg
						};
						this.$hide();
						this.init = true;
						this.showPhone = false
					} else {
						this.$hide()
						this.$toast('查无数据')
					}
				});
			}
		}
	};
</script>

<style lang="scss">
	page {
		background-color: #f5f5f5;
	}

	.cell_box {
		padding: 30rpx;

		.cell_item {
			display: flex;
			align-items: center;
			height: 70rpx;
			border-bottom: 2rpx soid #f5f5f5;

			&:last-of-type {
				border-bottom: none;
			}

			.title {
				color: #666;
				margin-right: 20rpx;
			}

			.input_view {
				flex: 1;
				overflow: hidden;
				text-align: right;
			}
		}
	}

	.popup_btn_box {
		display: flex;
		background-color: #fff;
		border-top: 1rpx solid #ddd;

		.btn {
			line-height: 80rpx;
			flex: 1;
			overflow: hidden;
			text-align: center;

			&:active {
				opacity: .8;
			}

			&.btn_l {
				border-right: 1rpx solid #ddd;
			}
		}
	}
</style>
